<!-- 结果（境内） -->
<template>
  <div class="fcontainer">
    <el-table
      :data="tableData"
      :show-header="false"
      :span-method="objectSpanMethod"
      border
      :row-class-name="getRowClassName"
      :cell-style="{ borderColor: '#bbb' }"
      :header-cell-style="{ borderColor: '#bbb' }"
      style="width: 80%; --el-table-border-color: #bbb"
    >
      <el-table-column
        class-name="one-index"
        prop="oneIndex"
        label=""
        align="center"
      />
      <el-table-column
        class-name="two-index"
        prop="twoIndex"
        label=""
        align="center"
      />
      <el-table-column
        class-name="three-index"
        prop="threeIndex"
        label=""
        align="center"
      />
      <el-table-column
        class-name="four-index"
        prop="fourIndex"
        label=""
        align="center"
      />
      <el-table-column
        class-name="five-index"
        prop="fiveIndex"
        label=""
        align="center"
      />
      <el-table-column
        class-name="six-index"
        prop="sixIndex"
        label=""
        align="center"
      />
      <el-table-column
        class-name="seven-index"
        prop="sevenIndex"
        label=""
        align="center"
      />
      <el-table-column
        class-name="eight-index"
        prop="eightIndex"
        label=""
        align="center"
      />
    </el-table>
  </div>
</template>
<script setup name="sureTemplate">
const getRowClassName = ({ row, rowIndex }) => {
  // 这里可以访问到行数据 row 和行索引 rowIndex
  console.log("---8899---");
  console.log(row, rowIndex);
  if (rowIndex === 2) {
    return "add-background";
  }
  if (rowIndex >= 3 && rowIndex < 6) {
    return "left-align";
  }
  if (rowIndex >= 6 && rowIndex < 12) {
    return "left-align-padding";
  }
  if (rowIndex === 12 || rowIndex === 15 || rowIndex === 16) {
    return "bold";
  }
  if (rowIndex === 17 && rowIndex > 0) {
    return "delete-background";
  }
  return "";
};
const tableData = ref([
  {
    oneIndex: "评估基准日:",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "2014-12-31",
    fiveIndex: "备案/核准编号",
    sixIndex: "",
    sevenIndex: "",
    eightIndex:
      "最终选取评估方法如果为收益法或市场法,请将评估结果填在长期股权投资对应表格内.",
  },
  {
    oneIndex: "评估结果使用有效期至:",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "2015-12-30",
    fiveIndex: "原备案/核准编号:",
    sixIndex: "",
    sevenIndex: "金额单位:人民币(万元)",
    eightIndex: "",
  },
  {
    oneIndex: "项目",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "账面价值",
    fiveIndex: "评估价值",
    sixIndex: "増镇减值",
    sevenIndex: "增减率($)",
    eightIndex: "",
  },
  {
    oneIndex: "流动资产",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "10,129.1693",
    fiveIndex: "10,129.1693",
    sixIndex: "0.00",
    sevenIndex: "0.00",
    eightIndex: "",
  },
  {
    oneIndex: "非流动资产",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "2.3868",
    fiveIndex: "2.2254",
    sixIndex: "-0.1614",
    sevenIndex: "-6.7622",
    eightIndex: "",
  },
  {
    oneIndex: "其中:长期股权投资",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "",
    fiveIndex: "",
    sixIndex: "",
    sevenIndex: "",
    eightIndex: "",
  },
  {
    oneIndex: "投资性房地产",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "",
    fiveIndex: "",
    sixIndex: "",
    sevenIndex: "",
    eightIndex: "",
  },
  {
    oneIndex: "固定资产",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "2.3868",
    fiveIndex: "2.2254",
    sixIndex: "-0.1614",
    sevenIndex: "-6.7622",
    eightIndex: "",
  },
  {
    oneIndex: "在建工程",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "",
    fiveIndex: "",
    sixIndex: "",
    sevenIndex: "",
    eightIndex: "",
  },
  {
    oneIndex: "无形资产",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "",
    fiveIndex: "",
    sixIndex: "",
    sevenIndex: "",
    eightIndex: "",
  },
  {
    oneIndex: "其中:无形资产-土地使用权",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "0.00",
    fiveIndex: "0.00",
    sixIndex: "0.00",
    sevenIndex: "",
    eightIndex: "",
  },
  {
    oneIndex: "其他非流动资产",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "0.00",
    fiveIndex: "0.00",
    sixIndex: "0.00",
    sevenIndex: "",
    eightIndex: "",
  },
  {
    oneIndex: "资产总计",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "10,131.5561",
    fiveIndex: "10,131.3947",
    sixIndex: "-0.1614",
    sevenIndex: "-0.0016",
    eightIndex: "",
  },
  {
    oneIndex: "流动负债",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "164. 2384",
    fiveIndex: "164. 2384",
    sixIndex: "0.00",
    sevenIndex: "0.00",
    eightIndex: "",
  },
  {
    oneIndex: "非流动负债",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "",
    fiveIndex: "",
    sixIndex: "",
    sevenIndex: "",
    eightIndex: "",
  },
  {
    oneIndex: "负债总计",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "164. 2384",
    fiveIndex: "164. 2384",
    sixIndex: "0.00",
    sevenIndex: "0.00",
    eightIndex: "",
  },
  {
    oneIndex: "净资产",
    twoIndex: "",
    threeIndex: "",
    fourIndex: "9,967.3177",
    fiveIndex: "9,967.1563",
    sixIndex: "0.00",
    sevenIndex: "0.00",
    eightIndex: "",
  },
  {
    oneIndex: "股权比例(%)",
    twoIndex: "转让",
    threeIndex: "50.00",
    fourIndex: "4,983.6589",
    fiveIndex: "4,983.5782",
    sixIndex: "-0.0807",
    sevenIndex: "-0.0016",
    eightIndex: "",
  },
]);
const objectSpanMethod = ({ rowIndex, columnIndex }) => {
  // rowIndex, // 行索引  columnIndex, // 列索引
  if (columnIndex == 0) {
    if (
      rowIndex === 0 ||
      rowIndex === 1 ||
      rowIndex === 2 ||
      rowIndex === 3 ||
      rowIndex === 4 ||
      rowIndex === 5 ||
      rowIndex === 6 ||
      rowIndex === 7 ||
      rowIndex === 8 ||
      rowIndex === 9 ||
      rowIndex === 10 ||
      rowIndex === 11 ||
      rowIndex === 12 ||
      rowIndex === 13 ||
      rowIndex === 14 ||
      rowIndex === 15 ||
      rowIndex === 16
    ) {
      return {
        rowspan: 1,
        colspan: 3,
      };
    }
  } else if (columnIndex == 1) {
    if (
      rowIndex === 0 ||
      rowIndex === 1 ||
      rowIndex === 2 ||
      rowIndex === 3 ||
      rowIndex === 4 ||
      rowIndex === 5 ||
      rowIndex === 6 ||
      rowIndex === 7 ||
      rowIndex === 8 ||
      rowIndex === 9 ||
      rowIndex === 10 ||
      rowIndex === 11 ||
      rowIndex === 12 ||
      rowIndex === 13 ||
      rowIndex === 14 ||
      rowIndex === 15 ||
      rowIndex === 16
    ) {
      return {
        rowspan: 0,
        colspan: 0,
      };
    }
  } else if (columnIndex == 2) {
    if (
      rowIndex === 0 ||
      rowIndex === 1 ||
      rowIndex === 2 ||
      rowIndex === 3 ||
      rowIndex === 4 ||
      rowIndex === 5 ||
      rowIndex === 6 ||
      rowIndex === 7 ||
      rowIndex === 8 ||
      rowIndex === 9 ||
      rowIndex === 10 ||
      rowIndex === 11 ||
      rowIndex === 12 ||
      rowIndex === 13 ||
      rowIndex === 14 ||
      rowIndex === 15 ||
      rowIndex === 16
    ) {
      return {
        rowspan: 0,
        colspan: 0,
      };
    }
  } else if (columnIndex == 5) {
    if (rowIndex === 0) {
      return {
        rowspan: 1,
        colspan: 2,
      };
    }
  } else if (columnIndex == 6) {
    if (rowIndex === 0) {
      return {
        rowspan: 0,
        colspan: 0,
      };
    }
  } else if (columnIndex == 7) {
    if (rowIndex === 0) {
      return {
        rowspan: 18,
        colspan: 1,
      };
    }
  } else {
    return {
      rowspan: 1,
      colspan: 1,
    };
  }
};
</script>

<style scoped lang="scss">
.fcontainer {
  :deep(.el-table) {
    .add-background {
      font-weight: bold;
      background-color: #e4f6fd;
    }
    .delete-background {
      .four-index,
      .one-index {
        background: transparent !important;
        font-weight: normal !important;
      }
    }
    .left-align-padding .one-index {
      text-align: left;
      padding-left: 30px;
    }
    .left-align .one-index {
      text-align: left;
    }
    .bold .one-index {
      font-weight: bold;
    }
    .one-index {
      background-color: #e4f6fd;
    }
    .el-table__body-wrapper {
      border-color: #bbb !important; /* 例如：#f00（红色） */
    }
    .el-table__header-wrapper {
      border-color: #bbb !important; /* 例如：#f00（红色） */
    }
    .add-background .eight-index {
      background: #fff !important;
      font-weight: normal !important;
      text-align: left !important;
    }
  }
}
</style>

